
.wangEditor-container {
	
	//引用通用样式
	@import 'common.less';

	//.wangEditor-container的样式
	position: relative;
	border: 1px solid @editor-container-border-color;
	background-color: @reverse-color;

	//-----------------------------------元素样式-----------------------------------
	//清除编辑器 focus 时的边框
	div[contenteditable=true]{
		&:focus{
			outline: none; 
		}
	}

	//菜单栏
	.wangEditor-btn-container{
		text-align: left;
		border-bottom: 1px solid @btn-container-border-color;
		background-color: @btn-container-bg-color;

		//菜单按钮组
		&-group{
			float: left;
			padding:0 5px;
			border-right: 1px solid @btn-container-border-color;
		}

		//菜单按钮
		&-btn{
		    display: inline-block;
		    *display:inline; 
		    *zoom:1;
		    padding: 10px 10px;
		    text-decoration: none;
		    cursor:pointer;
		    .common-font-style();
		    margin-bottom: -2px;

		    &:hover{
		    	.filter(100);
		    }

		    i{
		    	display: block;
		    	float: left;
		    	font-size: 1em;
		    	font-style: normal;
		    }
		}
		//默认按钮样式
		&-btn-default{
			color: @fore-color;
			.filter(60);
		}
		//被选中的按钮样式
		&-btn-selected{
			.border-radius();
			.filter(100);
		}
	}

	//下拉菜单
	.drop-menu-style{  /*通用配置*/
		list-style-type: none;
	    border-left: 1px solid @btn-container-border-color;
	    background-color: @reverse-color;
	    position: absolute;
	    margin-top: 35px;
	    padding-left:0;
	    -webkit-padding-start: 0;
	    z-index:10000;

	    -webkit-box-shadow: 1px 1px 3px #ccc;  
		-moz-box-shadow: 1px 1px 3px #ccc;  
		box-shadow: 1px 1px 3px #ccc;  
	}
	.wangEditor-drop-menu{
		.drop-menu-style !important;  //防止页面其他样式修改ul-li

		a{
			.common-font-style();
			text-align: left;
			display: block;
		    text-decoration: none;
		    color: @fore-color;
		    padding: 3px 10px;

		    &:hover{
		    	background-color: @selected-bg-color;
		    }
		}
	}

	//下拉面板
	.wangEditor-drop-panel{
		width: 200px;
		border-left: 1px solid @btn-container-border-color;
	    background-color: @reverse-color;
	    position: absolute;
	    margin-top: 35px;
	    padding:5px 5px 0 0;
	    z-index:10000;

	    -webkit-box-shadow: 1px 1px 3px #ccc;  
		-moz-box-shadow: 1px 1px 3px #ccc;  
		box-shadow: 1px 1px 3px #ccc;  

	    //float item
	    .wangEditor-drop-panel-floatItem{
	    	float: left;
	    	margin-left: 5px;
	    	margin-bottom: 5px;
	    	font-size:0.9em;
	    	a{
			    text-decoration: none;
	    	}

	    	//针对颜色块（前景色、背景色）
	    	.forColorItem{
	    		display: block;
	    		width: 18px;
	    		border: 1px solid @editor-container-border-color;
	    	}

	    	//表情icon
	    	img{
	    		border: 0;
	    		max-width: 70px;
	    		max-height: 50px;
	    	}
	    }
	}

	.wangEditor-drop-panel-big{
		width: 400px;
	}

	//表情tab container
	.wangEditor-expression-tab-container{
		padding-left: 10px;
		padding-top: 2px;
		padding-bottom: 6px;

		//表情tab
		.wangEditor-expression-tab{
			cursor: pointer;
			float: left;
			margin-right: 5px;
			padding: 3px 5px;
			font-size: 0.8em;
			.border-radius();
		}
	
		//选中状态
		.selected{
			background-color: #dddddd;
		}
	}

	//表情分组 container
	.wangEditor-expression-group-container{

		//表情分组
		.wangEditor-expression-group{
			
		}
	}

	//鼠标放置在按钮上的 tooltip 效果
	.wangEditor-toolTip{
		position: absolute;
		margin-top: -22px;
    	display: none;

    	&-content{
    		.common-font-style(0.8em, 1);
		    background-color: @fore-color;
		    color: @reverse-color;
		    padding: 5px;
		    .border-radius();
    	}
    	&-content::after{  /*div下方的三角*/
    		content:"";
    		border:5px solid;
    		border-color: @fore-color transparent transparent transparent;
    		position: absolute;
    		right: 40%;
    		top: 100%;
    	}
	}

	//弹出框容器
	.wangEditor-modal-container{
		z-index: 15000;
	}

	//富文本编辑区
	.wangEditor-textarea-container{
		word-wrap: break-word;
		overflow-y: auto;
		background-color: #fff;
	}
	.wangEditor-textarea{
		background-color: @txt-bg-color;
		padding: 10px 15px 10px 15px;
    	p{
    		margin: 0.7em 0;
    	}
    	ul{
    		margin-left: 20px;
    	}
    	ol{
    		margin-left: 20px;
    	}
	}

	//表格、图片左上角的删除按钮
	.wangEditor-elemDeleteBtn{
	    text-align: center;
	    padding: 1px 5px 2px 5px;
	    color: #fff;
	    background-color: @fore-color;
	    text-decoration: none;
	    cursor: pointer;
	    position: absolute;
	    display: none;
	    .border-radius(3px);

	    &:hover{
	    	color:@fore-color;
	    	background-color: @selected-bg-color;
	    }
	}

	//resize图片的div
	.wangEditor-imgResize{
		position: absolute;
		display: none;
		cursor: se-resize;

		//画一个三角
		width: 0;
	    height: 0;
	    border-bottom: 20px solid @fore-color;
	    border-left: 20px solid transparent;
	}
}